<template>
	<view>
		<PsyTabs :tabs="courseMoreTabs" @change="courseMoreTabsChange" backgroundColor="#f1f1f1">
			<view v-show="courseMoreTabsIndex == 0">
				<PsyVideoItem :data="dataList" />
			</view>
			<view v-show="courseMoreTabsIndex == 1">
				<PsyVideoItem :data="dataList" />
			</view>
		</PsyTabs>
	</view>
</template>

<script>
	import {
		lessonInfo
	} from "@/common/api/detail/detail.js"
	import PsyVideoItem from '../../components/PsyVideoItem.vue'
	import {
		requireEnums
	} from '../detail'
	import tip from '@/common/util/tip.js'
	export default {
		components: {},
		data() {
			return {
				courseMoreTabs: requireEnums.courseMoreTabs,
				courseMoreTabsIndex: 0,
				dataList: [],
				page: 1,
				size: 10,
				loading: false, // 用于防止重复加载
				noMoreData: false // 用于判断是否还有更多数据
			}
		},
		mounted() {
			this.lessonInfoFn()
		},
		computed: {},
		methods: {
			courseMoreTabsChange(index) {
				this.courseMoreTabsIndex = index
				this.page = 1
				this.lessonInfoFn()
				this.loading = false
				this.noMoreData = false
			},
			lessonInfoFn() {
				if (this.loading || this.noMoreData) return; // 如果正在加载或没有更多数据，则不再请求
				this.loading = true;
				lessonInfo({
					page: this.page,
					size: this.size
				}).then((res) => {
					if (res.content?.length) {
						this.dataList = this.dataList.concat(res.content); // 将新数据追加到现有数据中
						this.page += 1; // 页码增加
					} else {
						this.noMoreData = true; // 没有更多数据时设置为true
					}
				}).catch(() => {
					tip.toast('网络异常!');
				}).finally(() => {
					this.loading = false; // 请求结束后重置loading状态
				})
			}
		},
		watch: {},

		// 页面周期函数--监听页面加载
		onLoad() {},
		// 页面周期函数--监听页面初次渲染完成
		onReady() {},
		// 页面周期函数--监听页面显示(not-nvue)
		onShow() {},
		// 页面周期函数--监听页面隐藏
		onHide() {},
		// 页面周期函数--监听页面卸载
		onUnload() {},
		// 页面处理函数--监听用户下拉动作
		// onPullDownRefresh() { uni.stopPullDownRefresh(); },
		// 页面处理函数--监听用户上拉触底
		onReachBottom() {
			this.lessonInfoFn(); // 触底时加载更多数据
		},
		// 页面处理函数--监听页面滚动(not-nvue)
		// onPageScroll(event) {},
		// 页面处理函数--用户点击右上角分享
		// onShareAppMessage(options) {},
	}
</script>

<style scoped></style>